<div class="row">
    <div class="col-xs-3 side-context">
        <div id="centra-fold-tree"
             data-topple="hsTree"
             data-load-url="common/fold/search.act?type=dir"
             data-send-urls-0="['common/fold/delete.act','.delete','您确定要删除此目录?']"
             data-open-urls-0="['centra/manage/file/fold_form.html?path={ID}','.create','@']"
             data-open-urls-1="['centra/manage/file/fold_edit.html?path={ID}','.modify','@']"
             data-id-key="path"
             data-pid-key="path"
             data-cnum-key="size"
             data-root-id="6666cd76f96956469e7be39d750cc7d9"
             data-root-name="目录结构">
            <div class="toolbox board btn-group">
                <button type="button" class="create for-create btn btn-default">添加</button>
                <button type="button" class="modify for-select btn btn-default">修改</button>
                <button type="button" class="delete for-select btn btn-default" title="删除"><span class="bi bi-hi-remove text-danger"></span></button>
            </div>
            <div class="treebox panel panel-body panel-default"></div>
        </div>
    </div>
    <div class="col-xs-9 main-context"></div>
</div>
<script type="text/javascript">
    (function($) {
        var context = H$("#centra-fold-tree");
        var pathMap = {"6666cd76f96956469e7be39d750cc7d9": "/"};

        // path 作为 ID 使用, 进行 md5 编码, 规避 jquery 选择器的语法问题
        context.data("loadBack", function(rst, pid) {
            rst = hsResponse(rst);
            pid = hex_md5   (pid);
            if (! rst.ok) {
                return;
            }
            if (rst.list)
            for(var i = 0; i < rst.list.length; i ++) {
                var info = rst.list[i];
                var hash = hex_md5(info.path);
                pathMap [hash]  =  info.path ;
                info.path = hash;
            }
            return HsTree.prototype.loadBack.call(this, rst, pid);
        });
        context.data("sendBack", function(btn, rst, data) {
            data.path = hex_md5(data.path);
            return HsTree.prototype.sendBack.call(this, btn, rst, data);
        });
        context.data("openBack", function(btn, box, data) {
            data.path = hex_md5(data.path);
            return HsTree.prototype.openBack.call(this, btn, box, data);
        });
        context.data("load", function(pid, url, data) {
            pid = pathMap[pid];
            return HsTree.prototype.load.call(this, pid, url, data);
        });
        context.data("send", function(btn, msg, url, data) {
            data.path = pathMap[data.path];
            return HsTree.prototype.send.call(this, btn, msg, url, data);
        });
        context.data("open", function(btn, box, url, data) {
            data.path = pathMap[data.path];
            return HsTree.prototype.open.call(this, btn, box, url, data);
        });
        context.on("saveBack sendBack", function(evt, rd, sd, obj) {
            if ($(evt.target).is(".modify,.delete")) {
                obj.load(obj.getPid( obj.getSid() ));
                evt.preventDefault ( );
                return false;
            } else
            if ($(evt.target).is(".create")) {
                obj.load(obj.getSid());
                evt.preventDefault ( );
                return false;
            }
        });
        context.on("treeSelect", function(evt, nid, obj) {
            evt.stopPropagation(  );

            var box  = obj.context ;
            var rid  = obj.getRid();
            var pre  = pathMap[nid];
            box.find(".for-create").prop("disabled", rid == nid);
            box.find(".for-select").prop("disabled", rid == nid || /^\/.*?\/$/.test(pre));

            var prm = encodeURIComponent(pre);
            var url = "centra/manage/file/file.html?type=file&path="+prm;
            context.closest (".side-context")
                   .siblings(".main-context")
                   .hsLoad  ( url );
        });

        // 自适滚动
        hsFlexRoll(context.find(".treebox"), $("#main-context"));
    })(jQuery);
</script>